@import url('../../../../css/form.css');
@import url('../../../library/field/mixedFieldCreator.css');
:host {
  width: 100%; display: block; --button-color: #364150; --button-hover-color: #000000
}
container {
  width: 100%
}
container.on {
  display: block !important
}
container icons {
  display: inline-block
}
container icons jtbc-svg {
  display: inline-block; vertical-align: middle; width: 16px; height: 16px; margin-right: 5px; opacity: 0.6; cursor: pointer; transition: all .3s ease
}
container icons jtbc-svg:hover {
  opacity: 1
}
container icons jtbc-svg:last-child {
  margin-left: 10px
}
container icons jtbc-svg[name=close] {
  width: 14px; height: 14px
}
container button.add {
  display: inline-block; height: 30px; padding: 0px 20px; border: 0px; font-size: 14px; color: #fff; background: var(--button-color); border: 0px; border-radius: 0px; margin-right: 10px; cursor: pointer; transition: all .1s ease
}
container button.add:hover {
  background: var(--button-hover-color)
}
container .main {
  width: 100%; background: #ffffff
}
container .main div.list > ul {
  margin: 0px; padding: 0px; list-style: none
}
container .main div.list > ul > li {
  width: 100%; box-sizing: border-box; margin-top: 10px; padding: 10px; border: #d1d1d1 1px solid
}
container .main div.list > ul > li div.bar {
  width: calc(100% + 20px); padding: 10px; box-sizing: border-box; margin-left: -10px; margin-top: -10px; background: #f6f6f6; border-bottom: #d1d1d1 1px solid; position: relative; z-index: 100
}
container .main div.list > ul > li div.bar span.num {
  line-height: 20px
}
container .main div.list > ul > li div.bar span.num em {
  padding-left: 2px; font-style: normal
}
container .main div.list > ul > li div.bar span.num u {
  padding-left: 10px; text-decoration: none
}
container .main div.list > ul > li div.bar icons {
  position: absolute; top: 12px; right: 8px; z-index: 100
}
container .main div.list > ul > li:first-child jtbc-svg.up {
  display: none
}
container .main div.list > ul > li:last-child jtbc-svg.down {
  display: none
}
container div.mask {
  display: none
}
container.disabled {
  position: relative; z-index: 100
}
container.disabled div.mask {
  width: 100%; height: 100%; display: block; background: #dddddd; opacity: .3; position: absolute; top: 0px; left: 0px; z-index: 10000
}